<template>
    <div id='after-loan-allot-index'>
        <el-tabs v-model="activeName" @tab-click="handleClick">
            <el-tab-pane label="全部" name="first">
                <div class="header">
                    <div class="header-item">
                        <div class="header-item-left">姓名:</div>
                        <div class="header-item-right">
                            <el-input v-model="input1" placeholder="请输入姓名" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">电话号码:</div>
                        <div class="header-item-right">
                            <el-input v-model="input2" placeholder="请输入电话号码" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">逾期天数大于:</div>
                        <div class="header-item-right">
                            <el-input v-model="input3" placeholder="请输入天数" clearable></el-input>
                        </div>
                    </div>
                    <el-button type="primary" @click="searchFn">搜索</el-button>
                </div>
                <div class="header-bottom">
                    <div class="header-bottom-item">
                        <div class="header-item-left">分单状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="value1" placeholder="请选择" >
                                <el-option
                                  v-for="item in billOptions"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收人:</div>
                        <div class="header-item-right">
                            <el-select v-model="value2" placeholder="请选择">
                                <el-option
                                  v-for="item in collectorOptions"
                                  :key="item.id"
                                  :label="item.name"
                                  :value="item.id">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="value3" placeholder="请选择">
                                <el-option
                                  v-for="item in collectionStatusOptions"
                                  :key="item.lable"
                                  :label="item.lableName"
                                  :value="item.lable">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <el-dropdown trigger="click" @command="handleCommand">
                          <span class="el-dropdown-link txt-btn" >
                            分单
                          </span>
                          <el-dropdown-menu slot="dropdown" >
                            <el-dropdown-item v-for="(item,index) in splitBillArr" v-text="item.name" :key="index" :command="item.id"></el-dropdown-item>
                          </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                    <div class="header-bottom-item">
                        <el-button type="danger" @click="reset">撤销</el-button>
                    </div>
                </div>
                <el-row class="main">
                    <el-col :span="15">
                        <el-card class="main-left">
                          <loading v-if="allDetailss"></loading>
                            <el-table
                                v-else
                                :data="tableData"
                                stripe
                                current-row-key
                                highlight-current-row
                                @row-click="goAuthDetail"
                                @selection-change="handleSelectionChange"
                                style="width: 100%">
                                 <el-table-column
                                  type="selection"
                                  width="55">
                                </el-table-column>
                                <el-table-column
                                      prop="name"
                                      align="center"
                                      label="姓名">
                                    </el-table-column>
                                    <el-table-column
                                      prop="phone"
                                      align="center"
                                      label="电话号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="idCard"
                                      align="center"
                                      label="身份证号">
                                    </el-table-column>
                                    <el-table-column
                                      prop="lendAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="借款金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="needRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="应还总额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="underLinePartRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="已还金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="oveAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="罚息金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="repayOperatorName"
                                      align="center"
                                      label="跟进人">
                                    </el-table-column>
                            </el-table>
                            <el-pagination
                            v-show="tableData.length"
                              class="pagat"
                              @current-change="handleCurrentChange1"
                              :current-page="allCurrentPage1"
                              background
                              :page-count="5"
                              :page-size="10"
                              layout="total, prev, pager, next, jumper"
                              :total="allTotal">
                            </el-pagination>
                        </el-card>
                    </el-col>
                    <el-col :span="9">
                        <div class="main-right">
                            <el-card class="main-right-top">
                                <div class="mrt-top">
                                    <span>账单详情</span>
                                </div>
                                <loading v-show="allDetails"></loading>
                                <div class="mrt-main" v-show="!allDetails">
                                    <ul class="mrt-nav">
                                        <li><div>本金+利息+罚息</div><div>/未还</div></li>
                                        <li><div>应还总额</div><div>/未还</div></li>
                                        <li><div>逾期</div><div>天数</div></li>
                                        <li><div>实际还款</div><div>时间</div></li>
                                    </ul>
                                    <ul class="mrt-nav mrt-nav1">
                                        <li>{{BillDetailVO.repayAmountSum || placeholder }}元</li>
                                        <li>{{BillDetailVO.repayAmount || placeholder }}元</li>
                                        <li>{{BillDetailVO.days || placeholder }}天</li>
                                        <li>{{BillDetailVO.repayTimeStr || placeholder }}</li>
                                    </ul>
                                </div>
                            </el-card> 
                            <el-card class="main-right-bottom">
                                <div class="mrt-top">
                                    <span>跟进记录</span>
                                </div>
                                <loading v-show="allRecord"></loading>
                                <el-table
                                    v-show="!allRecord"
                                    :data="tableData1"
                                    stripe
                                    style="width: 100%">
                                    <el-table-column
                                      prop="time"
                                      label="跟进时间">
                                    </el-table-column>
                                    <el-table-column
                                      prop="calledPerson"
                                      label="被呼叫人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followWay"
                                      label="呼叫号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followPerson"
                                      label="跟进人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="info"
                                      label="跟进内容">
                                    </el-table-column>
                                </el-table>
                            </el-card>    
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <!-- 新增 -->
            <el-tab-pane label="新增" name="second" :lazy="true">
                <div class="header">
                    <div class="header-item">
                        <div class="header-item-left">姓名:</div>
                        <div class="header-item-right">
                            <el-input v-model="newinput1" placeholder="请输入姓名" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">电话号码:</div>
                        <div class="header-item-right">
                            <el-input v-model="newinput2" placeholder="请输入电话号码" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">逾期天数大于:</div>
                        <div class="header-item-right">
                            <el-input v-model="newinput3" placeholder="请输入天数" clearable></el-input>
                        </div>
                    </div>
                    <el-button type="primary" @click="newsearchFn">搜索</el-button>
                </div>
                <div class="header-bottom">
                    <div class="header-bottom-item">
                        <div class="header-item-left">分单状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="newvalue1" placeholder="请选择" >
                                <el-option
                                  v-for="item in billOptions"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收人:</div>
                        <div class="header-item-right">
                            <el-select v-model="newvalue2" placeholder="请选择">
                                <el-option
                                  v-for="item in collectorOptions"
                                  :key="item.id"
                                  :label="item.name"
                                  :value="item.id">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="newvalue3" placeholder="请选择">
                                <el-option
                                  v-for="item in collectionStatusOptions"
                                  :key="item.lable"
                                  :label="item.lableName"
                                  :value="item.lable">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <el-dropdown trigger="click" @command="handleCommandnew">
                          <span class="el-dropdown-link txt-btn" >
                            分单
                          </span>
                          <el-dropdown-menu slot="dropdown" >
                            <el-dropdown-item v-for="(item,index) in splitBillArr" v-text="item.name" :key="index" :command="item.id"></el-dropdown-item>
                          </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                    <div class="header-bottom-item">
                        <el-button type="danger" @click="resetNew">撤销</el-button>
                    </div>
                </div>
                <el-row class="main">
                    <el-col :span="15">
                        <el-card class="main-left" ref="mainL">
                          <loading v-if="allDetailsNews"></loading>
                            <el-table
                                v-else
                                :data="tableDataNew"
                                stripe
                                current-row-key
                                @row-click="goAuthDetailNew"
                                @selection-change="handleSelectionChangeNew"   
                                style="width: 100%">
                                 <el-table-column
                                  type="selection"
                                  width="55">
                                </el-table-column>
                                <el-table-column
                                      prop="name"
                                      align="center"
                                      label="姓名">
                                    </el-table-column>
                                    <el-table-column
                                      prop="phone"
                                      align="center"
                                      label="电话号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="idCard"
                                      align="center"
                                      label="身份证号">
                                    </el-table-column>
                                    <el-table-column
                                      prop="lendAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="借款金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="needRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="应还总额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="underLinePartRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="已还金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="oveAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="罚息金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="repayOperatorName"
                                      align="center"
                                      label="跟进人">
                                    </el-table-column>
                            </el-table>
                            <el-pagination
                            v-show="tableDataNew.length"
                              class="pagat"
                              @current-change="handleCurrentChange2"
                              :current-page="allCurrentPage2"
                              background
                              :page-count="5"
                              :page-size="10"
                              layout="total, prev, pager, next, jumper"
                              :total="allTotalNew">
                            </el-pagination>
                        </el-card>
                    </el-col>
                    <el-col :span="9">
                        <div class="main-right">
                            <el-card class="main-right-top">
                                <div class="mrt-top">
                                    <span>账单详情</span>
                                </div>
                                <loading v-show="allDetailsNew"></loading>
                                <div class="mrt-main" v-show="!allDetailsNew">
                                    <ul class="mrt-nav">
                                        <li><div>本金+利息+罚息</div><div>/未还</div></li>
                                        <li><div>应还总额</div><div>/未还</div></li>
                                        <li><div>逾期</div><div>天数</div></li>
                                        <li><div>实际还款</div><div>时间</div></li>
                                    </ul>
                                    <ul class="mrt-nav mrt-nav1">
                                        <li>{{BillDetailVONew.repayAmountSum || placeholder }}元</li>
                                        <li>{{BillDetailVONew.repayAmount || placeholder }}元</li>
                                        <li>{{BillDetailVONew.days || placeholder }}天</li>
                                        <li>{{BillDetailVONew.repayTimeStr || placeholder }}</li>
                                    </ul>
                                </div>
                            </el-card> 
                            <el-card class="main-right-bottom">
                                <div class="mrt-top">
                                    <span>跟进记录</span>
                                </div>
                                <loading v-show="allRecordNew"></loading>
                                <el-table
                                    v-show="!allRecordNew"
                                    :data="tableData1New"
                                    stripe
                                    style="width: 100%">
                                    <el-table-column
                                      prop="time"
                                      label="跟进时间">
                                    </el-table-column>
                                    <el-table-column
                                      prop="calledPerson"
                                      label="被呼叫人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followWay"
                                      label="呼叫号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followPerson"
                                      label="跟进人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="info"
                                      label="跟进内容">
                                    </el-table-column>
                                </el-table>
                            </el-card>    
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
            <!-- 复借  -->
            <el-tab-pane label="复借" name="third" :lazy="true">
                <div class="header">
                    <div class="header-item">
                        <div class="header-item-left">姓名:</div>
                        <div class="header-item-right">
                            <el-input v-model="afterinput1" placeholder="请输入姓名" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">电话号码:</div>
                        <div class="header-item-right">
                            <el-input v-model="afterinput2" placeholder="请输入电话号码" clearable></el-input>
                        </div>
                    </div>
                    <div class="header-item">
                        <div class="header-item-left">逾期天数大于:</div>
                        <div class="header-item-right">
                            <el-input v-model="afterinput3" placeholder="请输入天数" clearable></el-input>
                        </div>
                    </div>
                    <el-button type="primary" @click="afterSearchFn">搜索</el-button>
                </div>
                <div class="header-bottom">
                    <div class="header-bottom-item">
                        <div class="header-item-left">分单状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="aftervalue1" placeholder="请选择" >
                                <el-option
                                  v-for="item in billOptions"
                                  :key="item.value"
                                  :label="item.label"
                                  :value="item.value">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收人:</div>
                        <div class="header-item-right">
                            <el-select v-model="aftervalue2" placeholder="请选择">
                                <el-option
                                  v-for="item in collectorOptions"
                                  :key="item.id"
                                  :label="item.name"
                                  :value="item.id">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <div class="header-item-left">催收状态:</div>
                        <div class="header-item-right">
                            <el-select v-model="aftervalue3" placeholder="请选择">
                                <el-option
                                  v-for="item in collectionStatusOptions"
                                  :key="item.lable"
                                  :label="item.lableName"
                                  :value="item.lable">
                                </el-option>
                            </el-select>
                        </div>
                    </div>
                    <div class="header-bottom-item">
                        <el-dropdown trigger="click" @command="handleCommandafter">
                          <span class="el-dropdown-link txt-btn" >
                            分单
                          </span>
                          <el-dropdown-menu slot="dropdown" >
                            <el-dropdown-item v-for="(item,index) in splitBillArr" v-text="item.name" :key="index" :command="item.id"></el-dropdown-item>
                          </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                    <div class="header-bottom-item">
                        <el-button type="danger" @click="resetAfter">撤销</el-button>
                    </div>
                </div>
                <el-row class="main">
                    <el-col :span="15">
                        <el-card class="main-left">
                          <loading v-if="allDetailsAfters"></loading>
                            <el-table
                                v-else
                                :data="tableDataAfter"
                                stripe
                                current-row-key
                                @row-click="goAuthDetailAfter"
                                @selection-change="handleSelectionChangeAfter"  
                                style="width: 100%">
                                 <el-table-column
                                  type="selection"
                                  width="55">
                                </el-table-column>
                                <el-table-column
                                      prop="name"
                                      align="center"
                                      label="姓名">
                                    </el-table-column>
                                    <el-table-column
                                      prop="phone"
                                      align="center"
                                      label="电话号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="idCard"
                                      align="center"
                                      label="身份证号">
                                    </el-table-column>
                                    <el-table-column
                                      prop="lendAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="借款金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="needRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="应还总额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="underLinePartRepayAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="已还金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="oveAmount"
                                      align="center"
                                      :formatter="ccn"
                                      label="罚息金额">
                                    </el-table-column>
                                    <el-table-column
                                      prop="repayOperatorName"
                                      align="center"
                                      label="跟进人">
                                    </el-table-column>
                            </el-table>
                            <el-pagination
                            v-show="tableDataAfter.length"
                              class="pagat"
                              @current-change="handleCurrentChange3"
                              :current-page="allCurrentPage3"
                              background
                              :page-count="5"
                              :page-size="10"
                              layout="total, prev, pager, next, jumper"
                              :total="allTotalAfter">
                            </el-pagination>
                        </el-card>
                    </el-col>
                    <el-col :span="9">
                        <div class="main-right">
                            <el-card class="main-right-top">
                                <div class="mrt-top">
                                    <span>账单详情</span>
                                </div>
                                <loading v-show="allDetailsAfter"></loading>
                                <div class="mrt-main" v-show="!allDetailsAfter">
                                    <ul class="mrt-nav">
                                        <li><div>本金+利息+罚息</div><div>/未还</div></li>
                                        <li><div>应还总额</div><div>/未还</div></li>
                                        <li><div>逾期</div><div>天数</div></li>
                                        <li><div>实际还款</div><div>时间</div></li>
                                    </ul>
                                    <ul class="mrt-nav mrt-nav1">
                                        <li>{{BillDetailVOAfter.repayAmountSum || placeholder }}元</li>
                                        <li>{{BillDetailVOAfter.repayAmount || placeholder }}元</li>
                                        <li>{{BillDetailVOAfter.days || placeholder }}天</li>
                                        <li>{{BillDetailVOAfter.repayTimeStr || placeholder }}</li>
                                    </ul>
                                </div>
                            </el-card> 
                            <el-card class="main-right-bottom">
                                <div class="mrt-top">
                                    <span>跟进记录</span>
                                </div>
                                <loading v-show="allRecordAfter"></loading>
                                <el-table
                                    v-show="!allRecordAfter"
                                    :data="tableData1After"
                                    stripe
                                    style="width: 100%">
                                    <el-table-column
                                      prop="time"
                                      label="跟进时间">
                                    </el-table-column>
                                    <el-table-column
                                      prop="calledPerson"
                                      label="被呼叫人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followWay"
                                      label="呼叫号码">
                                    </el-table-column>
                                    <el-table-column
                                      prop="followPerson"
                                      label="跟进人">
                                    </el-table-column>
                                    <el-table-column
                                      prop="info"
                                      label="跟进内容">
                                    </el-table-column>
                                </el-table>
                            </el-card>    
                        </div>
                    </el-col>
                </el-row>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
    import { Promise } from 'es6-promise'
    import loading from '../components/Loading.vue'
    import modal from '../components/Modal.vue'
    import confirm from '../components/Confirm.vue'
    import buttonLoading from '../components/ButtonLoading.vue'
    import dateFormat from '../filters/filter-dateFormat'
    import toYuan from '../filters/filter-toYuan'
    import  { mapGetters, mapActions }  from 'vuex'
    import { Trim } from '../utils/utils'
    import { addLenderValidation, resetAccountPasswordValidation, operatorEditValidation } from '../validation/validation'
    import { repayApi, financeApi, authApi, allApi, lenderApi } from '../api/api'
    import moment from 'moment'


    export default {
        components:{
            loading,
            modal,
            confirm,
            buttonLoading,
        },
        filters:{
            dateFormat,
            toYuan,
            booleanToStr(boolean){
                if(boolean === true){
                    return '是'
                }
                else{
                    return '否'
                }
            }
        },
        data() {
            return {
               activeName:"first",
               input1:"",
               input2:"",
               input3:"",
               allDetailsNews:false,
               allDetailsAfters:false,
               newinput1:"",
               newinput2:"",
               newinput3:"",
               afterinput1:"",
               afterinput2:"",
               afterinput3:"",
               placeholder:"--",
               value1:null,
               value2:null,
               value3:null,
               newvalue1:null,
               newvalue2:null,
               newvalue3:null,
               aftervalue1:null,
               aftervalue2:null,
               aftervalue3:null,
               allTotal:0,
               afterTotal:0,
               radio:0,
               allDetailss:false,
               radioAfter:0,
               allDetails:false,
               allRecord:false,
               allCurrentPage3:1,
               allCurrentPage1:1,
               allCurrentPage2:1,
               allRecordNew:false,
               collectorOptions:[{
                  id: null,
                  name: '所有'
                }],
               collectionStatusOptions:[{
                  lable: null,
                  lableName: '所有'
                }],
                billOptions: [{
                  value: null,
                  label: '所有'
                }, {
                  value: '1',
                  label: '已分配'
                }, {
                  value: '2',
                  label: '未分配'
                }],
                tableData: [],
                tableData1:[],
                allIndex:1,
                splitBillArr:[],
                BillDetailVO:{},
                id:null,
                allDetailsNew:false,
                tableDataNew:[],
                allTotalNew:0,
                tableDataNew:[],
                BillDetailVONew:{},
                newIndex:1,
                idNew:null,
                idAfter:null,
                radioNew:0,
                tableData1After:[],
                allTotalAfter:0,
                allDetailsAfter:false,
                tableData1New:[],
                tableDataAfter:[],
                BillDetailVOAfter:{},
                allRecordAfter:false,
                allfendanArr:[],
                allfendanArrNew:[],
                allfendanArrAfter:[],
            }
        },
        computed:{
            ...mapGetters([
                'msgTip',
                'localInfo'
            ]),
            currentPage(){
                if(_.isEmpty(this.listInfo)) return 1
                return this.listInfo.pageNum
            },
           
        },
        methods:{
            // actions
            ...mapActions([
                'showLoading',
                'hideLoading',
                'setMsgTip'
            ]),
            reset(){
               /*this.input1=""
               this.input2=""
               this.input3=""
               this.value1=null
               this.value2=null
               this.value3=null*/
               this.repayUndoTaskFn()
            },
            resetNew(){
                 let arr=[]
              for(var i = 0;i<this.allfendanArrNew.length;i++){
                  arr.push(this.allfendanArrNew[i].id)
              }
              let msg={
                taskId:arr.join(","),
              }
                repayApi.repayUndoTask(msg)
                .then(result=>{
                    this.newInit()
                    this.setMsgTip({
                        text:'撤销分单成功',
                        type:'success'
                    })
                    this.allfendanArrNew=[]
                })
                .catch(error => {
                    console.error(error)
                })
            },
            resetAfter(){
              let arr=[]
              for(var i = 0;i<this.allfendanArrAfter.length;i++){
                  arr.push(this.allfendanArrAfter[i].id)
              }
              let msg={
                taskId:arr.join(","),
              }
                repayApi.repayUndoTask(msg)
                .then(result=>{
                    this.afterInit()
                    this.setMsgTip({
                        text:'撤销分单成功',
                        type:'success'
                    })
                    this.allfendanArrAfter=[]
                })
                .catch(error => {
                    console.error(error)
                })
            },
            handleClick(tab){
              if(tab.name=="second"){
                  this.newInit()
              }else if(tab.name=="third"){
                  this.afterInit()
              }
            },
            /**
             * [searchFn 搜索函数]
             * @Author   lzh
             * @DateTime 2018-07-17T15:20:38+0800
             * @fn Trim(item,"g") item 传的参数 g:String 是否是全局
             * @params input1 姓名, input2 电话号码, input3 逾期天数大于,
             * @return   {[type]}                 [description]
             */
            searchFn(){
              this.allIndex=1;
              this.allInit()
            },
            /**
             * [handleCurrentChange1 全部分页]
             * @Author   lzh
             * @DateTime 2018-07-16T18:21:37+0800
             * @return   {[type]}                 [allIndex 当前页]
             */
             handleCurrentChange1(val){
                this.allIndex=val;
                this.allInit();
            },
            //全部催收人员
            collectionPerson(){
                repayApi.operatorList()
                .then(result=>{
                    this.collectorOptions=result
                    this.collectorOptions.unshift({
                      id: null,
                      name: '所有'
                    })
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //分单
            splitBillFn(){
                repayApi.operatorList()
                .then(result=>{
                    this.splitBillArr=result
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //撤销分单接口函数
            repayUndoTaskFn(){
               let arr=[]
              for(var i = 0;i<this.allfendanArr.length;i++){
                  arr.push(this.allfendanArr[i].id)
              }
              let msg={
                taskId:arr.join(","),
              }
                repayApi.repayUndoTask(msg)
                .then(result=>{
                  this.allInit();
                    this.setMsgTip({
                        text:'撤销分单成功',
                        type:'success'
                    })
                    this.allfendanArr=[];
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //新增保存分单
            handleCommandnew(command){
               let arr=[]
              for(var i = 0;i<this.allfendanArrNew.length;i++){
                  arr.push(this.allfendanArrNew[i].id)
              }
              let msg={
                operatorId:command,
                taskId:arr.join(","),
              }
              repayApi.repayAllotTask(msg)
                .then(result=>{
                    this.newInit();
                    this.setMsgTip({
                        text:'保存分单成功',
                        type:'success'
                    })
                    this.allfendanArrNew=[]
                })
                .catch(error => {
                    console.error(error)
                })
            },
            ccn(row, column, cellValue){
              if(cellValue!=0){
                 return (cellValue/100)
              }else{
                return cellValue
              }
            },
            handleCommandafter(command){
              let arr=[]
              for(var i = 0;i<this.allfendanArrAfter.length;i++){
                  arr.push(this.allfendanArrAfter[i].id)
              }
              let msg={
                operatorId:command,
                taskId:arr.join(","),
              }
              repayApi.repayAllotTask(msg)
                .then(result=>{
                    this.afterInit();
                    this.setMsgTip({
                        text:'保存分单成功',
                        type:'success'
                    })
                    this.allfendanArrAfter=[]
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //保存分单人员接口函数
            handleCommand(command){
              let arr=[]
              for(var i = 0;i<this.allfendanArr.length;i++){
                  arr.push(this.allfendanArr[i].id)
              }
              let msg={
                operatorId:command,
                taskId:arr.join(","),
              }
              repayApi.repayAllotTask(msg)
                .then(result=>{
                    this.allInit();
                    this.setMsgTip({
                        text:'保存分单成功',
                        type:'success'
                    })
                    this.allfendanArr=[]
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //催收状态
            collection(){
                repayApi.followLableList()
                .then(result=>{
                    this.collectionStatusOptions=result
                   
                    this.collectionStatusOptions.unshift({
                      lable: null,
                      lableName: '所有'
                    })
                    for(var i = 1;i<this.collectionStatusOptions.length;i++){
                      this.collectionStatusOptions[i].lable=i
                        
                    }
                })
                .catch(error => {
                    console.error(error)
                })
            },
            //all跟进记录
            getFollowRecordList(){
              let params={
                id:this.id
              }
              this.allRecord=true
                repayApi.getFollowRecordList(params)
                .then(result=>{
                    this.allRecord=false
                    this.tableData1=result.page.list
                })
                .catch(error => {
                    this.allRecord=false
                    console.error(error)
                })
            },
            goAuthDetail(row, event, column){
                this.id=row.id
                this.getFollowRecordList()
                this.repayBillDetailFn()
            },
            //all每条数据的详情
            repayBillDetailFn(){
                let params={
                  id:this.id,  
                }
                this.allDetails=true;
                repayApi.repayBillDetail(params)
                .then(result=>{
                    this.BillDetailVO=result
                    this.allDetails=false;
                    //this.tableData1=result.page.list
                })
                .catch(error => {
                    this.allDetails=false;
                    console.error(error)
                })
            },
            radioFn(index){
              console.log(index)
            },
            radioFnAfter(index){
              console.log(index)
            },
            handleSelectionChange(val) {
              this.allfendanArr=val;
            },
            handleSelectionChangeNew(val) {
              this.allfendanArrNew=val;
            },
            handleSelectionChangeAfter(val) {
              this.allfendanArrAfter=val;
            },
            allInit(){
              switch(this.value1){
                case "所有":
                this.value1=null;
                break;
                case "已分配":
                this.value1=1;
                break;
                case "未分配":
                this.value1=2;
                break;
              }
              this.allDetailss=true;
              this.allDetails=true;
              repayApi.allWaitFollowList({
                    name:Trim(this.input1,"g"),
                    pageIndex:this.allIndex,
                    phone:Trim(this.input2,"g"),
                    overdueDays:Trim(this.input3,"g"),
                    type:this.value1,
                    operatorId:this.value2,
                    followStatus:this.value3
                })
                .then(result=>{
                    if(!result.BillDetailVO){
                        this.allDetailss=false;
                        this.allDetails=false;
                        this.tableData=[];
                        this.allTotal=0;
                        this.tableData1=[];
                        this.BillDetailVO={};
                        return
                    }
                    this.allDetailss=false;
                    this.allDetails=false;
                    this.tableData=result.page.list
                    this.allTotal=result.page.totalRow
                    this.BillDetailVO=result.BillDetailVO
                    this.id=this.tableData[0].id;
                    this.getFollowRecordList();
                })
                .catch(error => {
                    this.allDetailss=false;
                    this.allDetails=false;
                    console.error(error)
                })
            },
            /************新增模块***************/
            newInit(){
              switch(this.newvalue1){
                case "所有":
                this.newvalue1=null;
                break;
                case "已分配":
                this.newvalue1=1;
                break;
                case "未分配":
                this.newvalue1=2;
                break;
              }
              this.allDetailsNews=true;
              this.allDetailsNew=true
              repayApi.allWaitFollowListNew({
                    name:Trim(this.newinput1,"g"),
                    pageIndex:this.newIndex,
                    phone:Trim(this.newinput2,"g"),
                    overdueDays:Trim(this.newinput3,"g"),
                    type:this.newvalue1,
                    operatorId:this.newvalue2,
                    followStatus:this.newvalue3
                })
                .then(result=>{
                    if(!result.BillDetailVO){
                        this.allDetailsNews=false;
                        this.allDetailsNew=false
                        this.tableDataNew=[];
                        this.allTotalNew=0;
                        this.tableData1New=[];
                        this.BillDetailVONew={};
                        return
                    }
                    this.allDetailsNews=false;
                    this.allDetailsNew=false
                    this.tableDataNew=result.page.list
                    this.allTotalNew=result.page.totalRow
                    this.BillDetailVONew=result.BillDetailVO
                    this.idNew=this.tableDataNew[0].id;
                    this.getFollowRecordListNew();
                })
                .catch(error => {
                    this.allDetailsNews=false;
                    this.allDetailsNew=false
                    console.error(error)
                })
            },
            handleCurrentChange2(val){
                this.newIndex=val;
                this.newInit();
            },
            goAuthDetailNew(row, event, column){
                this.idNew=row.id
                this.getFollowRecordListNew()
                this.repayBillDetailFnNew()
            },
            //new跟进记录
            getFollowRecordListNew(){
              let params={
                id:this.idNew
              }
              this.allRecordNew=true
                repayApi.getFollowRecordList(params)
                .then(result=>{
                    this.allRecordNew=false
                    this.tableData1New=result.page.list
                })
                .catch(error => {
                    this.allRecordNew=false
                    console.error(error)
                })
            },
            //new每条数据的详情
            repayBillDetailFnNew(){
                let params={
                  id:this.idNew,  
                }
                this.allDetailsNew=true;
                repayApi.repayBillDetail(params)
                .then(result=>{
                    this.BillDetailVONew=result
                    this.allDetailsNew=false;
                })
                .catch(error => {
                    this.allDetailsNew=false;
                    console.error(error)
                })
            },
            newsearchFn(){
              this.newIndex=1;
              this.newInit()
            },
            /************复借模块***************/
            afterInit(){
              switch(this.aftervalue1){
                case "所有":
                this.aftervalue1=null;
                break;
                case "已分配":
                this.aftervalue1=1;
                break;
                case "未分配":
                this.aftervalue1=2;
                break;
              }
              this.allDetailsAfters=true;
              this.allDetailsAfter=true;
              repayApi.allWaitFollowListAfter({
                    name:Trim(this.afterinput1,"g"),
                    pageIndex:this.afterIndex,
                    phone:Trim(this.afterinput2,"g"),
                    overdueDays:Trim(this.afterinput3,"g"),
                    type:this.aftervalue1,
                    operatorId:this.aftervalue2,
                    followStatus:this.aftervalue3
                })
                .then(result=>{
                    if(!result.BillDetailVO){
                        this.allDetailsAfters=false;
                        this.allDetailsAfter=false;
                        this.tableDataAfter=[];
                        this.allTotalAfter=0;
                        this.tableData1After=[];
                        this.BillDetailVOAfter={};
                        return
                    }
                    this.allDetailsAfters=false;
                    this.allDetailsAfter=false;
                    this.tableDataAfter=result.page.list
                    this.allTotalAfter=result.page.totalRow
                    this.BillDetailVOAfter=result.BillDetailVO
                    this.idAfter=this.tableDataAfter[0].id;
                    this.getFollowRecordListAfter();
                })
                .catch(error => {
                    this.allDetailsAfters=false;
                    this.allDetailsAfter=false;
                    console.error(error)
                })
            },
            handleCurrentChange3(val){
                this.afterIndex=val;
                this.afterInit();
            },
            goAuthDetailAfter(row, event, column){
                this.idAfter=row.id
                this.getFollowRecordListAfter()
                this.repayBillDetailFnAfter()
            },
            //new跟进记录
            getFollowRecordListAfter(){
              let params={
                id:this.idAfter
              }
              this.allRecordAfter=true
                repayApi.getFollowRecordList(params)
                .then(result=>{
                    this.allRecordAfter=false
                    this.tableData1After=result.page.list
                })
                .catch(error => {
                    this.allRecordAfter=false
                    console.error(error)
                })
            },
            //after每条数据的详情
            repayBillDetailFnAfter(){
                let params={
                  id:this.idAfter,  
                }
                this.allDetailsAfter=true;
                repayApi.repayBillDetail(params)
                .then(result=>{
                    this.BillDetailVOAfter=result
                    this.allDetailsAfter=false;
                })
                .catch(error => {
                    this.allDetailsAfter=false;
                    console.error(error)
                })
            },
            afterSearchFn(){
              this.afterIndex=1;
              this.afterInit()
            },
        },
        created(){
            this.allInit()
            this.collection()
            this.collectionPerson()
            this.splitBillFn()
        }
    }
</script>
<style>
    #after-loan-allot-index .el-card__body{
            padding:0;
        }
    #after-loan-allot-index .el-input__inner{
      height:44px;
      line-height: 44px;
    }

</style>
<style lang="scss" scoped>
    @import "../sass/variables";
    @import "../sass/extends";
    @import "../sass/mixins";
    
    #after-loan-allot-index{
        padding:20px 20px 0 20px;
        font-weight: normal;
        color:#333333;
        .el-button{
            width:140px;
            height:44px;
            padding:0;
        }
         .header-bottom-item .el-button{
            width:91px;
         }
         .el-table{
          font-size: 14px;
         }
        .el-radio__inner::after{
            content: "";
        }
    }
     @media screen and(max-width: 1280px){
        #pane-first .header,.header-bottom{
          position: relative;
        }
       /* .header-bottom{
          height:100px;
        } */
        .header .el-button{
          position: absolute;
          left:50px;
          top:120px;
        }
        .mrt-nav{
              height: 68px!important;
        }
       #after-loan-allot-index .main{
        margin-top:72px;
        }
        .header-bottom .el-dropdown{
          position: absolute;
          left:260px;
          top:56px;
        }
        .header-bottom .el-button{
          position: absolute;
          left:430px;
          top:56px;
        }
     }
    .header{
        width:100%;
        height:44px;
        min-width:1018px;
        margin-top:10px;
    }
    .header-item{
        margin-right:10px;
        min-width:240px;
        height:44px;
        float: left;
    }
    .header-item-left,.header-item-right{
        float: left;
    }
    .header-item-right{
        width:194px;
    }
    .header-item-left{
        height:44px;
        line-height: 44px;
        margin-right: 10px;
    }
    .header-bottom{
        height:44px;
        width:100%;
        min-width: 1350px;
        margin-top:20px;
    }
    .header-bottom-item{
        margin-right:10px;
        float: left;
        height:44px;
    }
    .txt-btn{
        width:91px;
        height:44px;
        float: left;
        text-align: center;
        border-radius: 4px;
        -webkit-border-radius: 4px;
           -moz-border-radius: 4px;
                border-radius: 4px;
        line-height: 44px;
        color:#fff;
        cursor: pointer;
        font-size: 16px;
        background: #32EA7C;
    }
    /* .el-dropdown-menu{
       padding:0 30px;
    } */
    .main{
        width:100%;
        min-height:500px;
        margin-top: 30px;
    }
     .main-left,.main-right{
       height:844px;
       margin-bottom: 20px;
   }
    .main-left{
    overflow-y:scroll; 
    }
   .main-right{
    margin-right:4px;
    margin-left:20px;
   }
    .main-right-top{
        height:170px;
        width: 100%;
    }
    .mrt-top{
        height:42px;
        font-size:12px;
        border-bottom: 1px solid #EBEDF1;
        span{
            float: left;
            height:42px;
            line-height: 42px;
            margin-left:16px;
        }
    }

    .mrt-nav{
        height:36px;
        width:100%;
        font-size: 12px;
        li{
           width:25%;
           float: left;
           height:44px;
           padding-top:10px;
           div{
            text-align: center;
            line-height: 16px;
           }
        }
    }
    .mrt-nav1{
        height:36px;
        line-height: 36px;
        text-align: center;
        li{
            height:36px;
            padding-top:0px;
        }
    }
    @media screen and(max-width:1720px){
      .mrt-nav1{
        height:50px;
        li{
            line-height: 36px;
        }
        li:nth-child(1){
          line-height: 18px;
        }
      }
    }
    .main-right-bottom{
        width: 100%;
        overflow-y:scroll; 
        height:652px;
        margin-top:20px;
    }
     .pagat{
    margin-top: 20px;
    margin-right: 10px;
  }
</style>
